import {sameVnode} from "./sameNode";
import {patchVnode} from "./patchVnode";
import {createElement} from "./createElement";
import {patch} from "./path";

/**
 *
 * @param parentElm 对比后插入的dom节点
 * @param oldChild 旧虚拟节点
 * @param newChild 新虚拟节点
 */
export function updateChild(parentElm, oldChild, newChild) {
    //四指针
    let oldStartIdx = 0;
    let newStartIdx = 0;
    let oldEndIdx = oldChild.length - 1;
    let newEndIdx = newChild.length - 1;
    //四虚拟节点
    let oldStartNode = oldChild[0];
    let newStartNode = newChild[0];
    let oldEndNode = oldChild[oldEndIdx];
    let newEndNode = newChild[newEndIdx];
    //map
    let map = new Map();
    while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
        //节点不存在直接跳过
        if (oldStartNode === undefined) {
            oldStartNode = oldChild[++oldStartIdx];
        } else if (oldEndNode === undefined) {
            oldEndNode = oldChild[--oldEndIdx];
        } else if (newStartNode === undefined) {
            newStartNode = newChild[++newStartIdx];
        } else if (newEndNode === undefined) {
            newEndNode = newChild[--newEndIdx];
        } else if (sameVnode(oldStartNode, newStartNode)) {//旧前和新前
            console.log('匹配 旧前和新前')
            patchVnode(oldStartNode, newStartNode)
            newStartNode.elm = oldStartNode?.elm
            //两指针后移
            oldStartNode = oldChild[++oldStartIdx];
            newStartNode = newChild[++newStartIdx];

        } else if (sameVnode(oldEndNode, newEndNode)) {//旧后和新后
            console.log('匹配 旧后和新后')
            patchVnode(oldEndNode, newEndNode)
            newEndNode.elm = oldEndNode?.elm
            oldEndNode = oldChild[--oldEndIdx];
            newEndNode = newChild[--newEndIdx];

        } else if (sameVnode(oldStartNode, newEndNode)) {//旧前和新后
            console.log('匹配 旧前和新后')
            patchVnode(oldStartNode, newEndNode)
            newEndNode.elm = oldStartNode?.elm
            parentElm.insertBefore(oldStartNode.elm, oldEndNode.elm.nextSibling)
            oldStartNode = oldChild[++oldStartIdx];
            newEndNode = newChild[--newEndIdx];

        } else if (sameVnode(oldEndNode, newStartNode)) {//旧后和新前
            console.log('匹配 旧后和新前')
            patchVnode(oldEndNode, newStartNode)
            newStartNode.elm = oldEndNode?.elm
            parentElm.insertBefore(oldEndNode.elm, oldStartNode.elm)
            oldEndNode = oldChild[--oldEndIdx];
            newStartNode = newChild[++newStartIdx];

        } else {//都没匹配到
            console.log('map情况')
            if (map.size === 0) {
                for (let i = oldStartIdx; i <= oldEndIdx; i++) {
                    const key = oldChild[i].key;
                    if (key !== undefined) {
                        map.set(key, i);
                    }
                }
            }

            //在旧节点剩余匹配节点中寻找newStartIdx对应的这一项
            const itemIdx = map.get(newStartNode.key);

            //判断该节点是否存在旧节点剩余匹配中
            if (itemIdx) {
                //移动节点
                const moveNode = oldChild[itemIdx].elm;
                patchVnode(moveNode, newStartNode);
                parentElm.insertBefore(moveNode, oldStartNode.elm);
                //把oldChild中的这项设置为undefined，表示已经处理过
                oldChild[itemIdx] = undefined;
            } else {
                //新创建节点
                parentElm.insertBefore(createElement(newStartNode), oldStartNode.elm);
            }
            newStartNode = newChild[++newStartIdx];
        }
    }
    //需要新增dom节点
    if (oldStartIdx > oldEndIdx && newStartIdx <= newEndIdx) {
        // const fragment = new DocumentFragment();
        // for (let i = newStartIdx; i <= newEndIdx; i++) {
        //     console.log('需要新增的节点', newChild[i])
        //     let dom = createElement(newChild[i])
        //     fragment.appendChild(dom)
        // }
        // newEndIdx <= newChild.length - 1 ? parentElm.insertBefore(fragment, newEndNode.elm.nextSibling) : parentElm.appendChild(fragment);
        // parentElm.appendChild(fragment);
        console.log('newChild',newChild)
        const before = newChild[newEndIdx + 1] ? newChild[newEndIdx + 1].elm : null
        for (let i = newStartIdx; i <= newEndIdx; i++) {
            parentElm.insertBefore(createElement(newChild[i]), before)
        }

    }
    //需要删除dom节点
    if (newStartIdx > newEndIdx && oldStartIdx <= oldEndIdx) {
        for (let i = oldStartIdx; i <= oldEndIdx; i++) {
            console.log('需要删除的节点', oldChild[i])
            //节点存在删除，排除在第五种情况下设置undefined的可能性
            if (oldChild[i]) {
                parentElm.removeChild(oldChild[i].elm)
            }
        }
    }
}